<template>
  <!-- <div>概览页面</div> -->
  <div>
    <!-- <p>缺省参数</p> -->
    <TopFilter ref="formPanel" :list="formList" :labelWidth="110" :cols="3" @filterChange="changeHandle" @resetChange="resetChangeHand"></TopFilter>
    <!-- <FormPanel ref="formPanel" :list="formList" :cols="3" :labelWidth="110" :isSubmitBtn="false" @formChange="changeHandle" /> -->
    <!-- <el-button size="small" icon="el-icon-search" type="primary" @click="query">查询</el-button>
    <el-button size="small" icon="el-icon-refresh-left" type="primary" @click="reset">重置</el-button> -->

    <FilterTable
      ref="table"
      :selectionType="'single'"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'rows'"
      columnsRef="yxqHdwhTable"
      :onRowSelectChange="onRowSelectChange"
      :onColumnsChange="columns => (this.columns = columns)"
    >
      <template slot="controls">
        <el-button size="small" type="primary" icon="el-icon-plus" @click="addRecordHandle()">新增</el-button>
      </template>
    </FilterTable>

    <!-- <BaseDialog :visible.sync="visible" title="服务活动新增" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }" destroyOnClose>
      <AddActivity ref="addActivity" :type="1" @close="closeAddActivity" />
    </BaseDialog> -->
    <Drawer :visible.sync="visible" title="服务活动新增" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }" destroyOnClose>
      <AddActivity ref="addActivity" :type="1" @close="closeAddActivity" />
    </Drawer>
    <BaseDialog :visible.sync="visibleedit" title="服务活动修改" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }" destroyOnClose>
      <AddActivity ref="addActivity" :type="2" :detaildata="detaildata" @close="closeVisibleedit" @EditAddActivity="EditAddActivity" />
      <!-- <EditAddActivity ref="EditAddActivity" @EditAddActivity="EditAddActivity" /> -->
    </BaseDialog>
    <BaseDialog :visible.sync="visiblemxdetail" title="服务活动明细" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }" destroyOnClose>
      <detailsAddActivity ref="detailsAddActivity" :detaildata="detaildata" @detailsAddActivity="detailsAddActivity" />
    </BaseDialog>
  </div>
</template>

<script>
import { getOrderList, Obsolete, Release } from '@/api/repair/repair/activitesManage';
import AddActivity from './addActivity';
// import EditAddActivity from './Edit/EditAddActivity'
import detailsAddActivity from './Details/detailsAddActivity';
import { dictionary } from '@/utils/dictMixin';
export default {
  name: 'activitesManage',
  components: {
    AddActivity,
    // EditAddActivity,
    detailsAddActivity
  },
  mixins: [dictionary],
  data() {
    return {
      detaildata: '',
      choose: [], // 选中的对象
      columns: this.createTableColumns(),
      formList: this.createFormList(),
      visiblemxdetail: false,
      visibleedit: false,
      visible: false,
      fetchParams: { xhrAbort: true },
      fetchApi: getOrderList
      // vownerList: this.createVownerList(),
    };
  },
  mounted() {},
  methods: {
    validateFn(rule, value, callback) {
      if (value.length < rule.limit) {
        return callback(new Error(rule.message));
      }
      callback();
    },
    addRecordHandle() {
      this.visible = true;
    },
    // 新增关闭
    closeAddActivity(val) {
      this.visible = false;
      this.$refs.formPanel.SUBMIT_FORM();
    },
    // 编辑关闭
    closeVisibleedit(val) {
      this.visibleedit = false;
      this.$refs.formPanel.SUBMIT_FORM();
    },
    // 选中数据
    onRowSelectChange(val) {
      this.choose = val;
    },
    // 查询按钮方法
    query() {
      this.$refs.formPanel.SUBMIT_FORM();
    },
    // 重置按钮方法
    reset() {
      this.$refs.formPanel.RESET_FORM();
      this.changeHandle();
    },
    changeHandle(val) {
      this.fetchParams = Object.assign({}, val, { offset: 0, xhrAbort: false });
    },
    // 编辑弹框开启
    edit(val) {
      this.visibleedit = true;
      this.detaildata = val;
    },
    // 编辑弹框关闭
    EditAddActivity() {
      this.visibleedit = false;
    },
    // 明细弹框开启
    detail(val) {
      this.visiblemxdetail = true;
      this.detaildata = val;
    },
    // 明细弹框关闭
    detailsAddActivity() {
      this.visiblemxdetail = false;
    },
    resetChangeHand() {},
    // 发布接口
    Release(val) {
      this.$confirm('此操作将发布该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          let res = await Release(val);
          this.$refs.formPanel.SUBMIT_FORM();
          if (res.resultCode == 200) {
            this.$notify.success({ title: '提示信息', message: '发布成功！' });
          } else {
            this.$notify.error({ title: '提示信息', message: '发布失败!' });
          }
        })
        .catch(() => {
          this.$notify.error({ title: '提示信息', message: '已取消发布' });
        });
    },
    // 取消接口
    Obsolete(val) {
      this.$confirm('此操作将取消该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          let res = await Obsolete(val);
          this.$refs.formPanel.SUBMIT_FORM();
          if (res.resultCode == 200) {
            this.$notify.success({ title: '提示信息', message: '取消成功！' });
          } else {
            this.$notify.error({ title: '提示信息', message: '取消失败!' });
          }
        })
        .catch(() => {
          // this.$notify.error({ title: '提示信息', message: '已取消作废' });
        });
    },
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '活动编号',
          fieldName: 'activityCode',
          placeholder: '',
          initialValue: ''
        },
        {
          type: 'SELECT',
          label: '发布状态',
          fieldName: 'releaseTag',
          itemList: this.createDictList('8078'),
          placeholder: '请选择...',
          initialValue: ''
        },
        {
          type: 'INPUT',
          label: '活动名称',
          fieldName: 'activityName',
          placeholder: '',
          initialValue: ''
        },
        {
          type: 'RANGE_DATE',
          label: '开始 - 结束日期',
          fieldName: 'beginDateFrom|beginDateTo',
          placeholder: '请输入...'
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          fixed: 'left',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '操作',
          dataIndex: 'column-action',
          width: 200,
          fixed: 'left',
          render: props => {
            return (
              <div>
                <el-button size="mini" type="text" disabled={props.row.DOWN_TAG == 10041001 || props.row.RELEASE_TAG != 80781001} onClick={() => this.edit(props.row.ACTIVITY_CODE)}>
                  编辑
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="mini" type="text" onClick={() => this.detail(props.row.ACTIVITY_CODE)}>
                  明细
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="mini" type="text" disabled={props.row.DOWN_TAG == 10041001 || props.row.RELEASE_TAG != 80781001} onClick={() => this.Release(props.row.ACTIVITY_CODE)}>
                  发布
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="mini" type="text" disabled={props.row.DOWN_TAG == 10041001 || props.row.RELEASE_TAG == 80781003} onClick={() => this.Obsolete(props.row.ACTIVITY_CODE)}>
                  取消
                </el-button>
              </div>
            );
          }
        },
        {
          title: '活动编号',
          dataIndex: 'ACTIVITY_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '活动名称',
          dataIndex: 'ACTIVITY_NAME',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        //  {   //目前先不展示
        //   title: '业务类型',
        //   dataIndex: 'businessType',
        //   sorter: true,
        //     render: props => {
        //     return <span>{this.createDictText(props.row.businessType,'8047')}</span>;
        //   }
        // },
        // {
        //   title: '全球活动编号',
        //   dataIndex: 'GLOBAL_ACTIVITY_CODE',
        //   sorter: true
        // },
        // {
        //   title: '主题',
        //   dataIndex: 'ACTIVITY_TITLE',
        //   sorter: true
        // },
        // {
        //   title: '活动类型',
        //   dataIndex: 'ACTIVITY_TYPE',
        //   sorter: true,
        //   render: props => {
        //     return <span>{this.createDictText(props.row.ACTIVITY_TYPE,'8080')}</span>;
        //   }
        // },
        // {
        //   title: '活动类别',
        //   dataIndex: 'ACTIVITY_KIND',
        //   sorter: true,
        //     render: props => {
        //     return <span>{this.createDictText(props.row.ACTIVITY_KIND, '8079')}</span>;
        //   }
        // },
        {
          title: '开始日期',
          dataIndex: 'BEGIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd',
          filter: true,
          filterType: 'date-range'
        },
        {
          title: '结束日期',
          dataIndex: 'END_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd',
          filter: true,
          filterType: 'date-range'
        },
        {
          title: '发布时间',
          dataIndex: 'RELEASE_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd',
          filter: true,
          filterType: 'date-range'
        },
        {
          title: '发布状态',
          dataIndex: 'RELEASE_TAG',
          sorter: true,

          filter: true,
          filterType: 'checkbox',
          filterItems: [
            { value: 80781001, text: '未发布' },
            { value: 80781002, text: '已发布' },
            { value: 80781003, text: '已取消' }
          ],
          render: props => {
            return <span>{this.createDictText(props.row.RELEASE_TAG, '8078')}</span>;
          }
        },
        {
          title: '工时费',
          dataIndex: 'LABOUR_AMOUNT',
          precision: 2,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '维修材料费',
          dataIndex: 'REPAIR_PART_AMOUNT',
          precision: 2,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '活动总金额',
          dataIndex: 'ACTIVITY_AMOUNT',
          precision: 2,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        // {
        //   title: '是否活动优先',
        //   dataIndex: 'ACTIVITY_FIRST',
        //   sorter: true,
        //   render: props => {
        //     return <span>{this.createDictText(props.row.ACTIVITY_FIRST, '1004')}</span>;
        //   }
        // },
        {
          title: '是否下发',
          dataIndex: 'DOWN_TAG',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [
            { value: 10041002, text: '否' },
            { value: 10041001, text: '是' }
          ],
          render: props => {
            return <span>{this.createDictText(props.row.DOWN_TAG, '1004')}</span>;
          }
        },
        {
          title: '是否多次参加活动',
          dataIndex: 'IS_REPEAT_ATTEND',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [
            { value: 10041002, text: '否' },
            { value: 10041001, text: '是' }
          ],
          render: props => {
            return <span>{this.createDictText(props.row.IS_REPEAT_ATTEND, '1004')}</span>;
          }
        }
      ];
    }
  }
};
</script>

<style scoped lang="less">
.bg1 {
  border: 1px solid @borderColor;
  border-radius: @borderRadius;
  box-shadow: @boxShadow;
  padding: @modulePadding;
  padding-left: 0;
  padding-top: 15px;
  padding-bottom: 15px;
}
.bg2 {
  margin-top: 10px;
}
.btn {
  text-align: center;
}
</style>
